<!-- 连续扫码 -->
<template>
	<view>
		<view>
			<navitop>
				<i class="iconfont icon-jiantou-copy" slot="left-slot" @tap="outlot"></i>
				<span slot="center-slot">
					<h4>{{titles}}</h4>
				</span>
				<!-- <i slot="right-slot" class="iconfont icon-youcecaidan"></i> -->
			</navitop>
		</view>
		<view :style="'margin-top:' + nv_height">
			<div class="contin_comm">
				<div class="contin_input">
					<textarea v-model="content"></textarea>
				</div>
				<div class="contin_bott" @click='up_code'>
					<button>提交</button>
				</div>
			</div>
		</view>
		<!-- <view>
			<button @click="code_on">开启连扫</button>
		</view> -->
			<view class="contin_alter"  v-if="alert_cont" :style="'margin-top:' + nv_height_alert">
				
				<div class="contin_suss">
					<div>
						失败
					</div>
					<div>
						<scroll-view scroll-y="true" class="opst" @scroll="scroll">
							<div class='contion_text' v-for="(item,index) in rundata.failMatchCodes">
								{{item}}
							</div>
						</scroll-view>
					</div>	
				</div>
				<div class="contin_suss">
					<div>
						成功
					</div>
					<div>
						<scroll-view scroll-y="true" class="opst" @scroll="scroll">
							<div class='contion_text' v-for="(item,index) in rundata.successMatchCodes">
								{{item}}
							</div>	
						</scroll-view>
					</div>
				</div>
				<div class='contin_suss'>
					<div>
						其他
					</div>
					<div>
						<scroll-view scroll-y="true" class="opst" @scroll="scroll">
							<div class='contion_text' v-for="(item,index) in rundata.notMatchCodes">
								{{item}}
							</div>
						</scroll-view>
					</div>	
				</div>
				<button class="contion_butt" type="primary" @click="out_alert">确定</button>
			</view>
			
			
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import navitop from '@/components/common/navi-top'
	import {
		batchReportBarcode
	} from '@/common/api/job/machining.js'
	export default {
		mixins: [MescrollMixin], // 使用mixin
		components: {
			MescrollMixin,
			navitop,
		},
		data() {
			return {
				titles: '连续扫码',
				nv_height: '', // 顶部距离
				uid: '',
				content: [],
				scrollTop: 0,
				rundata: '',
				alert_cont: false,
				nv_height_alert:''
			}
		},
		onLoad(opton) {
			this.uid = opton.id;
		},
		onShow() {
			let _this = this;
			uni.$off('continuity')
			uni.$on('continuity', function(data) {
				console.log('监听到事件来自 continuity ，携带参数 msg 为：' + data.msg);
				_this.content.push(data.msg)
			})
		},
		mounted() {
			this.nv_height_alert =  uni.getSystemInfoSync().statusBarHeight + 50 + 'px';
			this.nv_height = uni.getSystemInfoSync().statusBarHeight + 75 + 'px';

		},
		methods: {
			outlot() {
				uni.navigateBack()
			},
			
			out_alert(){
				this.alert_cont = false;
			},
			
			code_on(){
				uni.navigateTo({
					url: "/pages/common/index/dcode"
				})
			},
			
			// 提交
			up_code() {
				if(this.content.length){
				let str_data = this.content.toString();
				batchReportBarcode({barcodeStr: str_data,erpProcessRouteDetailId: this.uid}).then((rows) => {
					if (rows.code == 200) {
						this.rundata = rows.data;
						this.alert_cont = true;
					}
				})
				}else{
					uni.showToast({
						icon: 'error',
						title: '请扫码'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>

	.opst {
		height: 100px;
	}
	
	.contin_comm {
		width: 95%;
		margin: auto;
		background-color: #fff;
		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
	}

	.contin_input {
		textarea {
			width: 90%;
			height: 300px;
			border: 1px solid #cacaca;
			padding: 3px 5px 0 5px;
			position: relative;
			top: 10px;
			margin: auto;
			border-radius: 4px;
		}
	}

	.contin_bott {
		margin: 5% 0 0 0;
		padding: 0 0 10px 0;
	}


	.contin_alter {
		height: 100%;
		width: 100%; 
		position: fixed;
		top: 0;
		z-index: 1;
		background-color: #FFFFFF;
		overflow: hidden;
	}
	

	.contin_suss {
		border: 1px dashed #cacaca;
		margin-top: 10px;
	}

	.contion_text {
		padding: 0 0 0 30rpx;
	}

	.contion_butt {
		position: relative;
		bottom: 0;
		width: 100%;
	}
</style>
